<template>
  <div class="parent-page">
    <div>父组件房子：{{ house }}</div>
    <button @click="getRefs($refs)">点击获取refs</button>
    <br />
    <Child ref="c1" />
    <Child2 ref="c2" />
  </div>
</template>
<script setup lang="ts" name="refAndParent">
import Child from './child.vue';
import Child2 from './child2.vue';
import { ref,defineExpose } from 'vue';

const c1 = ref();
const c2 = ref();

const house = ref(100);
defineExpose({ editHouse })

function getRefs(refs:any){
  for(let key in refs){
    refs[key].books += 10;
  }
}

function editHouse(num:number){
  house.value -= num;
}

</script>
<style  scoped>
.parent-page{
  padding: 30px;
}
</style>
